<script setup lang="ts">
import dayjs from "dayjs";
import { AccountBookData } from "../type";
const props = withDefaults(
  defineProps<{
    data: AccountBookData[];
  }>(),
  {
    data: () => [],
  }
);

const formatterTime = (
  row: AccountBookData,
  column: object,
  cellValue: number
) => dayjs(cellValue).format();
</script>

<template>
  <div class="container">
    <el-button>这是一个按钮</el-button>
    <el-table :data="props.data" stripe>
      <el-table-column prop="category" label="账单分类" />
      <el-table-column
        prop="time"
        label="账单时间"
        :formatter="formatterTime"
      />
      <el-table-column prop="type" label="账单类型" />
      <el-table-column prop="amount" label="账单金额" />
    </el-table>
  </div>
</template>

<style scoped>
.container {
  margin: auto;
  width: 1360px;
  border: 1px solid #eee;
  padding: 30px;
}
</style>
